<html style="font-size: 36px;">

<head>
    <style type="text/css">
        .amap-indoor-map .label-canvas {
            position: absolute;
            top: 0;
            left: 0
        }

        .amap-indoor-map .highlight-image-con * {
            pointer-events: none
        }

        .amap-indoormap-floorbar-control {
            position: absolute;
            margin: auto 0;
            bottom: 165px;
            right: 12px;
            width: 35px;
            text-align: center;
            line-height: 1.3em;
            overflow: hidden;
            padding: 0 2px
        }

        .amap-indoormap-floorbar-control .panel-box {
            background-color: rgba(255, 255, 255, .9);
            border-radius: 3px;
            border: 1px solid #ccc
        }

        .amap-indoormap-floorbar-control .select-dock {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            box-sizing: border-box;
            height: 30px;
            border: solid #4196ff;
            border-width: 0 2px;
            border-radius: 2px;
            pointer-events: none;
            background: linear-gradient(to bottom, #f6f8f9 0, #e5ebee 50%, #d7dee3 51%, #f5f7f9 100%)
        }

        .amap-indoor-map .transition {
            transition: opacity .2s
        }

        
        .amap-indoormap-floorbar-control .transition {
            transition: top .2s, margin-top .2s
        }

        .amap-indoormap-floorbar-control .select-dock:after,
        .amap-indoormap-floorbar-control .select-dock:before {
            content: "";
            position: absolute;
            width: 0;
            height: 0;
            left: 0;
            top: 10px;
            border: solid transparent;
            border-width: 4px;
            border-left-color: #4196ff
        }

        .amap-indoormap-floorbar-control .select-dock:after {
            right: 0;
            left: auto;
            border-left-color: transparent;
            border-right-color: #4196ff
        }

        .amap-indoormap-floorbar-control.is-mobile {
            width: 37px
        }

        .amap-indoormap-floorbar-control.is-mobile .floor-btn {
            height: 35px;
            line-height: 35px
        }

        .amap-indoormap-floorbar-control.is-mobile .select-dock {
            height: 35px;
            top: 36px
        }

        .amap-indoormap-floorbar-control.is-mobile .select-dock:after,
        .amap-indoormap-floorbar-control.is-mobile .select-dock:before {
            top: 13px
        }

        .amap-indoormap-floorbar-control.is-mobile .floor-list-box {
            height: 105px
        }

        .amap-indoormap-floorbar-control .floor-list-item .floor-btn {
            color: #555;
            font-family: "Times New Roman", sans-serif, "Microsoft Yahei";
            font-size: 16px
        }

        .amap-indoormap-floorbar-control .floor-list-item.selected .floor-btn {
            color: #000
        }

        .amap-indoormap-floorbar-control .floor-btn {
            height: 28px;
            line-height: 28px;
            overflow: hidden;
            cursor: pointer;
            position: relative;
            -webkit-touch-callout: none;
            -webkit-user-select: none;
            -khtml-user-select: none;
            -moz-user-select: none;
            -ms-user-select: none;
            user-select: none
        }

        .amap-indoormap-floorbar-control .floor-btn:hover {
            background-color: rgba(221, 221, 221, .4)
        }

        .amap-indoormap-floorbar-control .floor-minus,
        .amap-indoormap-floorbar-control .floor-plus {
            position: relative;
            text-indent: -1000em
        }

        .amap-indoormap-floorbar-control .floor-minus:after,
        .amap-indoormap-floorbar-control .floor-plus:after {
            content: "";
            position: absolute;
            margin: auto;
            top: 9px;
            left: 0;
            right: 0;
            width: 0;
            height: 0;
            border: solid transparent;
            border-width: 10px 8px;
            border-top-color: #777
        }

        .amap-indoormap-floorbar-control .floor-minus.disabled,
        .amap-indoormap-floorbar-control .floor-plus.disabled {
            opacity: .3
        }

        .amap-indoormap-floorbar-control .floor-plus:after {
            border-bottom-color: #777;
            border-top-color: transparent;
            top: -3px
        }

        .amap-indoormap-floorbar-control .floor-list-box {
            max-height: 153px;
            position: relative;
            overflow-y: hidden
        }

        .amap-indoormap-floorbar-control .floor-list {
            margin: 0;
            padding: 0;
            list-style: none
        }

        .amap-indoormap-floorbar-control .floor-list-item {
            position: relative
        }

        .amap-indoormap-floorbar-control .floor-btn.disabled,
        .amap-indoormap-floorbar-control .floor-btn.disabled *,
        .amap-indoormap-floorbar-control.with-indrm-loader * {
            -webkit-pointer-events: none !important;
            pointer-events: none !important
        }

        .amap-indoormap-floorbar-control .with-indrm-loader .floor-nonas {
            opacity: .5
        }

        .amap-indoor-map-moverf-marker {
            color: #555;
            background-color: #FFFEEF;
            border: 1px solid #7E7E7E;
            padding: 3px 6px;
            font-size: 12px;
            white-space: nowrap;
            display: inline-block;
            position: absolute;
            top: 1em;
            left: 1.2em
        }

        .amap-indoormap-floorbar-control .amap-indrm-loader {
            -moz-animation: amap-indrm-loader 1250ms infinite linear;
            -webkit-animation: amap-indrm-loader 1250ms infinite linear;
            animation: amap-indrm-loader 1250ms infinite linear;
            border: 2px solid #91A3D8;
            border-right-color: transparent;
            box-sizing: border-box;
            display: inline-block;
            overflow: hidden;
            text-indent: -9999px;
            width: 13px;
            height: 13px;
            border-radius: 7px;
            position: absolute;
            margin: auto;
            top: 0;
            left: 0;
            right: 0;
            bottom: 0
        }

        @-moz-keyframes amap-indrm-loader {
            0% {
                -moz-transform: rotate(0deg);
                transform: rotate(0deg)
            }

            100% {
                -moz-transform: rotate(360deg);
                transform: rotate(360deg)
            }
        }

        @-webkit-keyframes amap-indrm-loader {
            0% {
                -webkit-transform: rotate(0deg);
                transform: rotate(0deg)
            }

            100% {
                -webkit-transform: rotate(360deg);
                transform: rotate(360deg)
            }
        }

        @keyframes amap-indrm-loader {
            0% {
                -moz-transform: rotate(0deg);
                -ms-transform: rotate(0deg);
                -webkit-transform: rotate(0deg);
                transform: rotate(0deg)
            }

            100% {
                -moz-transform: rotate(360deg);
                -ms-transform: rotate(360deg);
                -webkit-transform: rotate(360deg);
                transform: rotate(360deg)
            }
        }
    </style>
    <style type="text/css" class="AMap.style">
        .vml {
            behavior: url(#default#VML);
            display: inline-block;
            position: absolute
        }

        .amap-custom {
            top: 0;
            left: 0;
            position: absolute
        }

        .amap-container img {
            max-width: none !important;
            max-height: none !important
        }

        .amap-container {
            touch-action: none;
            position: relative;
            overflow: hidden;
            background: #fcf9f2 url();
            -ms-touch-action: none
        }

        .amap-drags,
        .amap-layers {
            width: 100%;
            height: 100%;
            position: absolute;
            overflow: hidden
        }

        .amap-layers canvas {
            -webkit-touch-callout: none;
            -webkit-user-select: none;
            -khtml-user-select: none;
            -moz-user-select: none;
            -ms-user-select: none;
            user-select: none
        }

        .amap-layer img {
            pointer-events: none
        }

        .amap-e,
        .amap-maps {
            width: 100%;
            height: 100%
        }

        .amap-maps,
        .amap-e,
        .amap-layers,
        .amap-tile,
        .amap-tile-container {
            position: absolute;
            left: 0;
            top: 0;
            overflow: hidden
        }

        .amap-context {
            position: absolute;
            left: 0;
            top: 0
        }

        .amap-overlays,
        .amap-markers,
        .amap-marker {
            position: absolute;
            left: 0;
            top: 0
        }

        .amap-layers {
            z-index: 0
        }

        .amap-overlays {
            z-index: 110;
            cursor: default
        }

        .amap-markers {
            z-index: 120
        }

        .amap-controls {
            z-index: 150
        }

        .amap-copyright {
            position: absolute;
            display: block !important;
            left: 77px;
            height: 16px;
            bottom: 0;
            padding-bottom: 3px;
            font-size: 11px;
            font-family: Arial, sans-serif;
            z-index: 160
        }

        .amap-logo {
            position: absolute;
            bottom: 1px;
            left: 1px;
            z-index: 160;
            height: 20px
        }

        .amap-logo img {
            width: 73px !important;
            height: 20px !important;
            border: 0;
            vertical-align: baseline !important
        }

        .amap-icon {
            position: relative;
            z-index: 1
        }

        .amap-icon img {
            position: absolute;
            z-index: -1
        }

        .amap-marker-label {
            position: absolute;
            z-index: 2;
            border: 1px solid blue;
            background-color: white;
            white-space: nowrap;
            cursor: default;
            padding: 3px;
            font-size: 12px;
            line-height: 14px
        }

        .amap-info {
            position: absolute;
            left: 0;
            z-index: 140;
            width: 320px
        }

        .amap-menu {
            position: absolute;
            z-index: 140;
            _width: 100px
        }

        .amap-info-close {
            position: absolute;
            right: 5px;
            right: 12px;
            right: 11px;
            top: 5px;
            top: 2px;
            top: 2px;
            color: #c3c3c3;
            text-decoration: none;
            font: bold 16px/14px Tahoma, Verdana, sans-serif;
            width: 14px;
            height: 14px
        }

        .amap-info-outer,
        .amap-menu-outer {
            box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
            background: none repeat scroll 0 0 white;
            border-radius: 2px;
            padding: 1px;
            text-align: left
        }

        .amap-menu-outer:hover {
            box-shadow: 0 1px 2px rgba(0, 0, 0, 0.3)
        }

        .amap-info-contentContainer:hover .amap-info-outer {
            box-shadow: 0 1px 2px rgba(0, 0, 0, 0.3)
        }

        .amap-info-content {
            position: relative;
            background: #fff;
            padding: 10px 18px 10px 10px;
            line-height: 1.4;
            overflow: auto
        }

        .amap-marker-content {
            position: relative
        }

        .amap-info {
            _width: 320px
        }

        .amap-menu {
            _width: 100px
        }

        .amap-info-sharp-old {
            overflow: hidden;
            position: absolute;
            background-image: url(http://webapi.amap.com/images/arrows.png)
        }

        .bottom-center .amap-info-sharp-old {
            height: 12px;
            margin: 0 auto;
            width: 20px;
            background-position: center 12px;
            top: 100%;
            margin-top: -9px;
            left: 50%;
            margin-left: -10px
        }

        .bottom-left .amap-info-sharp-old {
            height: 12px;
            width: 13px;
            background-position: -16px -46px;
            top: 100%;
            margin-top: -9px
        }

        .bottom-right .amap-info-sharp-old {
            height: 12px;
            width: 13px;
            top: -1px;
            background-position: -56px -46px;
            left: 100%;
            margin-left: -13px;
            top: 100%;
            margin-top: -9px
        }

        .middle-left .amap-info-sharp-old {
            height: 20px;
            width: 12px;
            background-position: left;
            top: 50%;
            margin-top: -10px;
            margin-left: -11px
        }

        .center .amap-info-sharp-old {
            display: none
        }

        .middle-right .amap-info-sharp-old {
            height: 20px;
            margin-right: 0;
            width: 12px;
            background-position: right;
            left: 100%;
            margin-left: -9px;
            top: 50%;
            margin-top: -10px
        }

        .top-center .amap-info-sharp-old {
            height: 12px;
            margin: 0 auto;
            width: 20px;
            background-position: top;
            top: 0;
            margin-top: -3px;
            left: 50%;
            margin-left: -10px
        }

        .top-left .amap-info-sharp-old {
            height: 12px;
            width: 13px;
            background-position: -16px -3px;
            top: 0;
            margin-top: -3px
        }

        .top-right .amap-info-sharp-old {
            height: 12px;
            width: 13px;
            background-position: -56px -3px;
            left: 100%;
            margin-left: -13px;
            top: 0;
            margin-top: -3px
        }

        .amap-info-sharp {
            position: absolute
        }

        .bottom-center .amap-info-sharp {
            bottom: 0;
            left: 50%;
            margin-left: -8px;
            border-left: 8px solid transparent;
            border-right: 8px solid transparent;
            border-top: 8px solid #fff
        }

        .bottom-center .amap-info-sharp:after {
            position: absolute;
            content: "";
            margin-left: -8px;
            margin-top: -7px;
            border-left: 8px solid transparent;
            border-right: 8px solid transparent;
            border-top: 8px solid rgba(0, 0, 0, 0.3);
            filter: blur(2px);
            z-index: -1
        }

        .amap-info-contentContainer:hover.bottom-center .amap-info-sharp:after {
            border-top: 8px solid rgba(0, 0, 0, 0.5)
        }

        .bottom-left .amap-info-sharp {
            border-color: transparent #fff;
            border-width: 0 0 10px 10px;
            border-style: solid
        }

        .bottom-left .amap-info-sharp:after {
            position: absolute;
            content: "";
            margin-left: -10px;
            border-color: transparent rgba(0, 0, 0, 0.3);
            border-width: 0 0 10px 10px;
            border-style: solid;
            filter: blur(1px);
            z-index: -1
        }

        .amap-info-contentContainer:hover.bottom-left .amap-info-sharp:after {
            border-color: transparent rgba(0, 0, 0, 0.5)
        }

        .bottom-left .amap-info-content {
            border-radius: 2px 2px 2px 0
        }

        .bottom-right .amap-info-sharp {
            right: 0;
            border-top: 10px solid #fff;
            border-left: 10px solid transparent
        }

        .bottom-right .amap-info-sharp:after {
            position: absolute;
            margin-top: -9px;
            margin-left: -10px;
            content: "";
            border-top: 10px solid rgba(0, 0, 0, 0.3);
            border-left: 10px solid transparent;
            filter: blur(1px);
            z-index: -1
        }

        .amap-info-contentContainer:hover.bottom-right .amap-info-sharp:after {
            border-top: 10px solid rgba(0, 0, 0, 0.5)
        }

        .bottom-right .amap-info-content {
            border-radius: 2px 2px 0 2px
        }

        .top-center .amap-info-sharp {
            top: 0;
            left: 50%;
            margin-left: -8px;
            border-left: 8px solid transparent;
            border-right: 8px solid transparent;
            border-bottom: 8px solid #fff
        }

        .top-center .amap-info-sharp:after {
            position: absolute;
            content: "";
            margin-top: 0;
            margin-left: -8px;
            border-left: 8px solid transparent;
            border-right: 8px solid transparent;
            border-bottom: 8px solid rgba(0, 0, 0, 0.3);
            filter: blur(1px);
            z-index: -1
        }

        .top-left .amap-info-sharp {
            left: 0;
            top: 0;
            border-bottom: 10px solid #fff;
            border-right: 10px solid transparent
        }

        .top-left .amap-info-sharp:after {
            position: absolute;
            content: "";
            margin-top: 0;
            margin-left: 0;
            border-bottom: 10px solid rgba(0, 0, 0, 0.3);
            border-right: 10px solid transparent;
            filter: blur(1px);
            z-index: -1
        }

        .top-right .amap-info-sharp {
            right: 0;
            top: 0;
            border-bottom: 10px solid #fff;
            border-left: 10px solid transparent
        }

        .top-right .amap-info-sharp:after {
            position: absolute;
            content: "";
            margin-top: 0;
            margin-left: -10px;
            border-bottom: 10px solid rgba(0, 0, 0, 0.3);
            border-left: 10px solid transparent;
            filter: blur(1px);
            z-index: -1
        }

        .middle-right .amap-info-sharp {
            right: 0;
            top: 50%;
            margin-top: -8px;
            border-top: 8px solid transparent;
            border-left: 8px solid #fff;
            border-bottom: 8px solid transparent
        }

        .middle-right .amap-info-sharp:after {
            position: absolute;
            content: "";
            margin-top: -8px;
            margin-left: -8px;
            border-top: 8px solid transparent;
            border-left: 8px solid rgba(0, 0, 0, 0.3);
            border-bottom: 8px solid transparent;
            filter: blur(1px);
            z-index: -1
        }

        .amap-info-contentContainer:hover.middle-right .amap-info-sharp:after {
            border-left: 8px solid rgba(0, 0, 0, 0.5)
        }

        .middle-left .amap-info-sharp {
            left: 0;
            top: 50%;
            margin-top: -8px;
            border-top: 8px solid transparent;
            border-right: 8px solid #fff;
            border-bottom: 8px solid transparent
        }

        .middle-left .amap-info-sharp:after {
            position: absolute;
            content: "";
            margin-top: -8px;
            margin-left: 0;
            border-top: 8px solid transparent;
            border-right: 8px solid rgba(0, 0, 0, 0.3);
            border-bottom: 8px solid transparent;
            filter: blur(1px);
            z-index: -1
        }

        .amap-info-contentContainer:hover.middle-left .amap-info-sharp:after {
            border-right: 8px solid rgba(0, 0, 0, 0.5)
        }

        .amap-info-contentContainer.top-left,
        .amap-info-contentContainer.top-center,
        .amap-info-contentContainer.top-right {
            padding-top: 8px
        }

        .amap-info-contentContainer.bottom-left,
        .amap-info-contentContainer.bottom-center,
        .amap-info-contentContainer.bottom-right {
            padding-bottom: 8px
        }

        .amap-info-contentContainer.middle-right {
            padding-right: 8px
        }

        .amap-info-contentContainer.middle-left {
            padding-left: 8px
        }

        .amap-menu-outer {
            margin: 0;
            padding: 0;
            list-style-type: none
        }

        ul.amap-menu-outer li {
            cursor: pointer;
            height: 35px;
            line-height: 35px;
            word-break: break-all;
            padding: 0 10px;
            font-size: 12px;
            white-space: nowrap
        }

        ul.amap-menu-outer li a {
            text-decoration: none;
            font-size: 13px;
            margin: 0 5px;
            color: #000;
            padding: 5px 5px
        }

        ul.amap-menu-outer li:hover {
            background-color: #f3f3ee
        }

        .amap-overlay-text-container {
            display: block;
            width: auto;
            word-break: keep-all;
            white-space: nowrap;
            overflow: hidden;
            text-overflow: ellipsis;
            background: #fff;
            padding: 2px 3px;
            border: 1px solid #ccc;
            border-radius: 3px
        }

        .amap-overlay-text-container.amap-overlay-text-empty {
            display: none
        }

        .amap-info-content-ie8 {
            border: 1px solid #9c9c9c
        }
    </style>
    <title>附近的门店列表</title>
    <meta charset="utf-8">
    <meta
        content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no,minimal-ui"
        name="viewport">
    <meta content="telephone=no" name="format-detection">
    <link href="/build/css/poilist-f3bb7194bc.css" rel="stylesheet" type="text/css">
    <link rel="stylesheet" href="https://a.amap.com/jsapi_demos/static/demo-center/css/demo-center.css">
    <script type="text/javascript">
        var staticFileUrl = '';
        //计算根元素字体大小
        (function (doc, win) {
            var docEl = doc.documentElement,
                resizeEvt = 'orientationchange' in window ? 'orientationchange' : 'resize',
                recalc = function () {
                    var clientWidth = docEl.clientWidth;
                    if (!clientWidth) return;
                    docEl.style.fontSize = window.screen.width / 10 + 'px';
                };
            if (!doc.addEventListener) return;
            win.addEventListener(resizeEvt, recalc, false);
            doc.addEventListener('DOMContentLoaded', recalc, false);
        })(document, window);
    </script>
    <!-- 微信js-sdk -->
    <script src="http://res.wx.qq.com/open/js/jweixin-1.4.0.js"></script>
    <!-- 高德地图api -->
    <script src="https://webapi.amap.com/maps?v=1.4.15&amp;key=954ea4b31e75f95f3ecf14a612ae745b"></script>
    <!--cript标签中的 crossorigin=“anonymous 为前端向服务端发送强制跨域请求  -->
    <script crossorigin="anonymous" id="amap_main_js"
        src="https://webapi.amap.com/maps?v=1.4.15&amp;key=954ea4b31e75f95f3ecf14a612ae745b&amp;cache=0"
        type="text/javascript"></script>
    <style type="text/css">
        .amap-container {
            cursor: url(https://webapi.amap.com/theme/v1.3/openhand.cur), default;
        }

        .amap-drag {
            cursor: url(https://webapi.amap.com/theme/v1.3/closedhand.cur), default;
        }
    </style>
    <script crossorigin="anonymous" id="amap_plus_js"
        src="https://webapi.amap.com/maps/modules?v=1.4.15&amp;key=954ea4b31e75f95f3ecf14a612ae745b&amp;vrs=1571644530085&amp;m=mouse,vectorlayer,overlay,wgl,sync"
        type="text/javascript"></script>
    <script src="https://a.amap.com/jsapi_demos/static/demo-center/js/demoutils.js"></script>
</head>

<body ondragstart="return false;" onselectstart="return true;">
    <div id="app">
        <div class="wm-page">
            <div id="mapContainer" class="map-wrapper amap-container" style="background: rgb(252, 249, 242);"><object
                    style="display: block; position: absolute; top: 0; left: 0; height: 100%; width: 100%; overflow: hidden; pointer-events: none; z-index: -1;"
                    type="text/html" data="about:blank"></object>
                <div class="amap-maps">
                    <div class="amap-drags" style="">
                        <div class="amap-layers" style="transform: translateZ(0px);">
                            <div class="amap-markers"
                                style="position: absolute; z-index: 120; top: 100px; left: 180px;">
                                <div class="amap-marker"
                                    style="top: -31px; left: -9px; z-index: 100; transform: rotate(0deg); transform-origin: 9px 31px; display: block;">
                                    <div class="amap-icon"
                                        style="position: absolute; overflow: hidden; width: 19px; height: 33px; opacity: 1;">
                                        <img src="https://webapi.amap.com/theme/v1.3/markers/n/mark_bs.png"
                                            style="width: 19px; height: 33px; top: 0px; left: 0px;"></div>
                                </div>
                            </div><canvas class="amap-layer" width="360" height="200"
                                style="position: absolute; z-index: 0; top: 0px; left: 0px; height: 200px; width: 360px;"></canvas><canvas
                                class="amap-labels" draggable="false" width="360" height="200"
                                style="position: absolute; z-index: 99; height: 200px; width: 360px; top: 0px; left: 0px;"></canvas>
                        </div>
                        <div class="amap-overlays" style=""></div>
                    </div>
                </div>
                <div style="display: none;"></div>
                <div class="amap-controls"></div><a class="amap-logo" href="http://gaode.com" target="_blank"
                    style="display: block;"><img src="https://webapi.amap.com/theme/v1.3/logo@1x.png"></a>
                <div class="amap-copyright" style="display: none; visibility: visible;">
                    <!--v1.4.15--> © 2019 AutoNavi <span class="amap-mcode">- GS(2018)1709号</span></div>
            </div>
            <div class="poi-search-wrapper poi-search-bg">
                <div class="poi-search poi-map-search poi-search-bg"><span class="search-left-icon"></span> <span
                        class="search-click">上海新帑实业有限公司</span> <span class="search-arrow"></span></div>
            </div>
            <!---->
            <div class="content-wrap bg-white" style="height: 1000px;">
                <div class="poi-wrap poi-wrap-with-map bg-white" style="">
                    <div class="poi-item">
                        <div class="poi-item-left"
                            style="background-image: url(&quot;https://image-c.weimobwmc.com/saas-wxbiz/b1e7d762ce604e28b597e5c371b6eda1.jpg&quot;);">
                        </div>
                        <div class="poi-item-right">
                            <div class="poi-right-wrap">
                                <div class="poi-top-title">
                                    <div class="poi-name">族蚂科技</div>
                                    <div class="poi-icon1"><a href="tel:13817707587" class="poi-line"
                                            style="margin-right: 2px;"><img src="/assets/images/tel1.png" alt=""
                                                class="dis-tc s-14"></a> <img src="/assets/images/icon_position.png"
                                            alt="" class="dis-tc s-20" style="margin-bottom: -3px;"></div>
                                </div>
                                <div class="poi-address"><span>17</span>m
                                    | <span>上海市金山区林盛路136号</span></div>
                            </div>
                        </div>
                    </div>
                </div>
                <!---->
                <div class="other-store" style="display: none;">
                    <h2 class="other-store-name">其他门店</h2>
                </div>
            </div>
            <!---->
        </div>
        <div>
            <div class="chooseMap" style="display: none;">
                <div class="btn-list">
                    <div class="btn-item close">取消</div>
                </div>
            </div>
        </div>
        <!---->
    </div>

    <script charset="utf-8" src="/build/js/bundle-7b8ab3676d.vendor.vue.js"></script>

    <script type="text/javascript">
        if (!String.prototype.format) {
            String.prototype.format = function () {
                var args = arguments;
                return this.replace(/{(\d+)}/g, function (match, number) {
                    return typeof args[number] != 'undefined' ? args[number] : match
                })
            }
        }
        //防抖
        window.debounce = function (fn, wait, immediate) {
            var timer = null;
            return function () {
                var context = this;
                var args = arguments;
                if (timer) {
                    clearTimeout(timer);
                }

                if (immediate) {
                    // 如果已经执行过，不再执行
                    var callNow = !timer;
                    timer = setTimeout(function () {
                        timer = null;
                    }, wait)
                    if (callNow) {
                        fn.apply(context, args)
                    }
                } else {
                    timer = setTimeout(function () {
                        fn.apply(context, args)
                    }, wait)
                }
            }
        };

        var browser = {
            ua: function () {
                var u = navigator.userAgent;
                var isChrome = u.match(/Chrome\/([\d.]+)/)
                    || u.match(/CriOS\/([\d.]+)/);
                var isAndroid = u.match(/(Android);?[\s\/]+([\d.]+)?/);
                var iosVersion = function () {
                    if (/iP(hone|od|ad)/.test(navigator.platform)) {
                        var v = (navigator.appVersion).match(/OS (\d+)_(\d+)_?(\d+)?/);
                        return [parseInt(v[1], 10), parseInt(v[2], 10),
                        parseInt(v[3] || 0, 10)];
                    }
                }();
                var chromeVersion = function () {
                    var chrome = navigator.userAgent.match(/Chrome\/(\d+)\./);
                    if (chrome) {
                        return parseInt(chrome[1], 10);
                    }
                }();
                var ios9 = iosVersion && iosVersion[0] >= 9;
                var chrome18 = isChrome && isAndroid && chromeVersion
                    && chromeVersion > 18;
                return { // 移动终端浏览器版本信息
                    trident: u.indexOf('Trident') > -1, // IE内核
                    presto: u.indexOf('Presto') > -1, // opera内核
                    webKit: u.indexOf('AppleWebKit') > -1, // 苹果、谷歌内核
                    gecko: u.indexOf('Gecko') > -1 && u.indexOf('KHTML') == -1, // 火狐内核
                    mobile: !!u.match(/AppleWebKit.*Mobile.*/), // 是否为移动终端
                    iOS: !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/), // ios终端
                    android: u.indexOf('Android') > -1 || u.indexOf('Linux') > -1, // android终端或uc浏览器
                    iPhone: u.indexOf('iPhone') > -1, // 是否为iPhone或者QQHD浏览器
                    iPad: u.indexOf('iPad') > -1, // 是否iPad
                    webApp: u.indexOf('Safari') == -1, // 是否web应该程序，没有头部与底部
                    weChat: u.indexOf('MicroMessenger') > -1,
                    UC: u.indexOf('UCBrowser') > -1,
                    u3: u.indexOf('U3') > -1,
                    chrome: u.indexOf('Chrome') > -1,
                    windowsPhone: u.indexOf("Windows Phone") > -1,
                    samsung: u.indexOf("Samsung") > -1,
                    QQ: u.match(/QQ/i) == "qq",
                    isChrome: isChrome,
                    isAndroid: isAndroid,
                    iosVersion: iosVersion,
                    chromeVersion: chromeVersion,
                    ios9: ios9,
                    chrome18: chrome18
                };
            }()
        }

        var wxPermissionList = [
            'openLocation',
            'updateAppMessageShareData',
            'updateTimelineShareData',
            'onMenuShareTimeline',
            'onMenuShareAppMessage',
            'onMenuShareQQ',
            'onMenuShareWeibo',
            'onMenuShareQZone',
            'chooseImage',
        ];

        function init() {
            var app = new Vue({
                el: '#app',
                data: {
                    lat: "",
                    lon: "",
                    pid: "",
                    cover: "",
                    address: "",
                    pageIndex: 1,
                    pageNum: 1,
                    totalPage: 1,
                    isLoading: true,
                    isShowChooseMap: false,
                    poiDetails: [],
                    poiListResponse: [],
                    mapInfoVos: [],
                    addressList: [],
                    locationInfoVos: [],
                    currentAddress: "", //选中的地址
                    show_address_error: false,//展示地址无效提示
                    cover: "",
                    poiId: [],
                    searchFlag: "",
                    is_input: false,//搜索框是否输入内容，默认不可以
                    is_search: false,//是否搜索过，为了区别search后数据不分页显示
                    wmTuwenUrl: "/saas/basis/{0}/{1}",
                    gaoDeMapUrl: "//uri.amap.com/marker?position={0},{1}&name={2}&src=weimob&coordinate=gaode&callnative=0",
                    baiduMapUrl: "//api.map.baidu.com/marker?location={0},{1}&title={2}&content={3}&output=html&src=webapp.weimob.poi",
                    tencentMapUrl: "//apis.map.qq.com/uri/v1/marker?marker=coord:{1},{0};title:{2};addr:{3}&referer=myapp",
                    // googleMapUrl: "//www.google.com/maps?q={0},{1}"
                    googleMapUrl: "//www.google.com/maps/search/?api=1&query={0}",
                    showMap: false,
                    iframeMapUrl: '//uri.amap.com/marker?position={0},{1}&name={2}&src=weimob&coordinate=gaode&callnative=0',
                },
                mounted() {
                    //80为搜索框的高度
                    this.$refs.contentWrap.style.height = window.screen.height - 80 + 'px';
                    this.getData();
                    //加载数据
                    this.getPoiList();
                    //下拉加载数据
                    this.scroll();
                    // 初始化微信jssdk
                    if (browser.ua.weChat) {
                        this.initWx();
                    }
                    this.initMap();

                },
                methods: {
                    initMap() {
                        var map = new AMap.Map('mapContainer', {
                            resizeEnable: true, //是否监控地图容器尺寸变化
                            zoom: 15, //初始地图级别
                            center: [this.lon || 121.498416, this.lat || 31.349136], //初始地图中心点
                        });
                        var marker = new AMap.Marker({
                            position: new AMap.LngLat(this.lon || 121.498416, this.lat || 31.349136),   // 经纬度对象，也可以是经纬度构成的一维数组[116.39, 39.9]
                            title: ''
                        });
                        map.add(marker);
                    },
                    initWx() {
                        $.ajax({
                            type: "POST",
                            url: '/saas/basis/api/querySignature',
                            data: {
                                url: window.location.href.split('#')[0],
                                pid: this.pid,
                            },
                            dataType: 'json',
                            timeout: 10 * 1000,
                            success: function (data) {
                                console.log('data jssdk', data);
                                this.wxParams = data.data || {};
                                wx.config({
                                    debug: false,
                                    appId: this.wxParams.appId,
                                    timestamp: this.wxParams.timestamp,
                                    nonceStr: this.wxParams.nonceStr,
                                    signature: this.wxParams.signature,
                                    jsApiList: wxPermissionList,
                                });
                                wx.ready(function () {
                                    var shareData = {
                                        title: '附近的门店列表', // 分享标题
                                        desc: '点击查看更多门店', // 分享描述
                                        link: '', // 分享链接，该链接域名或路径必须与当前页面对应的公众号JS安全域名一致
                                        imgUrl: 'http://cdn.weimob.com/saas/basis/poi.png', // 分享图标
                                        success: function () {
                                            // 设置成功
                                        }
                                    };
                                    // wx.updateAppMessageShareData(shareData);
                                    // wx.updateTimelineShareData(shareData);
                                    // wx.onMenuShareTimeline(shareData);
                                    // wx.onMenuShareAppMessage(shareData);
                                    if (wx.onMenuShareAppMessage) {
                                        wx.onMenuShareTimeline(shareData);
                                        wx.onMenuShareAppMessage(shareData);
                                    } else {
                                        wx.updateAppMessageShareData(shareData);
                                        wx.updateTimelineShareData(shareData);
                                    }
                                    // wx.error(function(res) {
                                    //   console.log('error', res)
                                    // })
                                })
                            },
                        });

                    },
                    openLocation(item, index) {
                        if (browser.ua.weChat) {
                            const mapInfoVos = item.mapInfoVos;
                            let mapInfoItem = {};
                            const _this = this;
                            const hasTencentMap = mapInfoVos.some(item => {
                                if (item.mapType === 2) {
                                    mapInfoItem = item;
                                }
                                return item.mapType === 2;
                            });
                            if (!hasTencentMap) {
                                this.jumpList(item, index, true);
                                return;
                            }
                            wx.ready(function () {
                                wx.openLocation({
                                    latitude: mapInfoItem.lat, // 纬度，浮点数，范围为90 ~ -90
                                    longitude: mapInfoItem.lon, // 经度，浮点数，范围为180 ~ -180。
                                    name: mapInfoItem.mapAddress, // 位置名
                                    address: mapInfoItem.mapAddress, // 地址详情说明
                                    scale: 16, // 地图缩放级别,整形值,范围从1~28。默认为最大
                                    infoUrl: '', // 在查看位置界面底部显示的超链接,可点击跳转
                                    fail: function () {
                                        _this.jumpList(item, index, true);
                                    }
                                });
                            });
                            wx.error(function () {
                                _this.jumpList(item, index, true)
                            })
                        } else {
                            this.jumpList(item, index, true)
                        }

                    },
                    scroll() {
                        var me = this;
                        window.onscroll = function () {
                            if (!me.searchFlag && (window.screen.height + document.body.scrollTop - document.body.scrollHeight + 20 >= 0)) {
                                //下拉加载数据
                                if (me.pageNum < me.totalPage) {
                                    me.pageNum++;
                                    me.getStoreList();
                                }
                            }
                        }
                    },
                    searchPoiByAddress(event) {
                        if (event.keyCode == 13) { //如果按的是enter键 13是enter 
                            event.preventDefault();
                            this.chooseFirstAddress()
                        }
                    },
                    //下拉搜索框颜色高亮
                    brightenKeyword(val) {
                        val = val + '';
                        if (val.indexOf(this.address) !== -1 && this.address !== '') {
                            return val.replace(this.address, '<font color="#2589FF">' + this.address + '</font>')
                        } else {
                            return val
                        }
                    },
                    //选择地址
                    chooseAddress(item) {
                        this.allowBodyScroll()
                        this.currentAddress = item.name;
                        this.commonChoose(item);
                        this.getPoiList();
                    },
                    //选择第一个地址
                    chooseFirstAddress() {
                        this.allowBodyScroll()
                        this.currentAddress = this.address;
                        this.is_input = false;
                        this.searchFlag = 1;
                        this.is_search = true;
                        this.getPoiDetailListByAddress();
                    },
                    commonChoose(item) {
                        this.is_input = false;
                        this.is_search = true;
                        this.searchFlag = 1;
                        this.address = "";
                        this.locationInfoVos = [];
                        this.lon = item.lon;
                        this.lat = item.lat;
                        this.initMap();
                    },
                    closeSearchFrame() {
                        this.is_input = false;
                    },
                    jumpList(item, index, status) {
                        //如果点击地图icon。跳转地图选择
                        if (status) {
                            this.mapInfoVos = item.mapInfoVos;
                            //如果地图是一个,直接跳转地图页面
                            if (this.mapInfoVos.length <= 1) {
                                var mapUrl = this.getJumpUrl(this.mapInfoVos[0]);
                                window.open(mapUrl, '_blank');
                                return;
                            }
                            this.isShowChooseMap = true;
                            return;
                        }
                        if (item.content) {
                            var twurl = this.wmTuwenUrl.format(this.pid, item.content);
                            window.parent.location.href = twurl;
                        } else {

                            this.mapInfoVos = item.mapInfoVos;
                            //如果地图是一个,直接跳转地图页面
                            if (this.mapInfoVos.length <= 1) {
                                var mapUrl = this.getJumpUrl(this.mapInfoVos[0]);
                                window.open(mapUrl, '_blank');
                                return;
                            }
                            this.isShowChooseMap = true;
                        }
                    },
                    // https://apis.map.qq.com/uri/v1/marker?marker=coord:39.892326,116.342763;title:超好吃冰激凌;addr:手帕口桥北铁路道口&referer=myapp
                    //apis.map.qq.com/uri/v1/marker?marker=coord:121.498421,31.34898;title:上海市宝山区微盟大厦;addr:上海市宝山区微盟大厦&referer=myapp
                    goToMap(data, e) {
                        e.stopPropagation();
                        var mapUrl = this.getJumpUrl(data);
                        window.open(mapUrl, '_blank');
                    },
                    //输入框获取焦点
                    getFocus() {
                        this.status = true
                    },
                    changeSearch() {
                        try {
                            this.is_input = true;
                            this.forbidBodyScroll();
                            this.$nextTick(function () {
                                //默认搜索框高亮
                                this.$refs.searchKeyword.focus();
                                this.status = true
                                var me = this;
                                //为了阻止ios滑动穿透，监听滚动事件，关闭键盘弹框(参考京东方案)
                                window.onscroll = function () {
                                    if (me.status) {
                                        me.$refs.searchKeyword.blur();
                                        me.status = false
                                    }
                                }
                            })
                            this.$refs.searchWrapper = window.screen.height + 'px'
                        } catch (error) {

                        }

                    },
                    getJumpUrl(data) {
                        switch (data.mapType) {
                            case 1:
                                return this.gaoDeMapUrl.format(data.lon, data.lat, data.mapAddress);
                            case 2:
                                return this.tencentMapUrl.format(data.lon, data.lat, data.mapAddress, data.mapAddress);
                            case 3:
                                return this.baiduMapUrl.format(data.lat, data.lon, data.mapAddress, data.mapAddress);
                            case 4:
                                var dealAddress = data.mapAddress.replace(/\s/g, '+');
                                return this.googleMapUrl.format(dealAddress);
                        }
                    },
                    getPoiDetailListByAddress() {
                        var me = this;
                        this.isLoading = true;
                        $.ajax({
                            type: "POST",
                            url: '/saas/basis/api/getPoiDetailListByAddress',
                            data: {
                                address: this.address,
                                pid: this.pid,
                                searchFlag: 1,
                            },
                            dataType: 'json',
                            timeout: 10 * 1000,
                            success: function (data) {
                                me.isLoading = false;
                                if (data.errcode == 0) {
                                    me.poiDetails = data.data && data.data.poiDetails ? data.data.poiDetails : [];
                                    me.poiListResponse = [];
                                } else {
                                    me.$nextTick(function () {
                                        me.show_address_error = true;
                                    })
                                    me.poiListResponse = [];
                                    me.poiDetails = [];
                                }
                            },
                        });
                    },
                    getPoiList() {
                        var me = this;
                        me.isLoading = true;
                        $.ajax({
                            type: "POST",
                            url: '/saas/basis/api/poiList',
                            data: {
                                pid: this.pid,
                                lon: this.lon,
                                lat: this.lat,
                                searchFlag: this.searchFlag
                            },
                            dataType: 'json',
                            timeout: 10 * 1000,
                            success: function (data) {
                                me.isLoading = false;
                                if (data.errcode == 0) {
                                    //将后台返回的数据回填
                                    me.poiDetails = data.data && data.data.poiDetails ? data.data.poiDetails : [];
                                    me.poiListResponse = data.data && data.data.poiListResponse && data.data.poiListResponse.list ? data.data.poiListResponse.list : [];
                                    me.pageNum = data.data && data.data.pageNum && data.data.poiListResponse ? data.data.poiListResponse.pageNum : 1;
                                    me.totalPage = data.data.poiListResponse && data.data.poiListResponse.total ? Math.ceil(data.data.poiListResponse.total / 10) : 1;
                                    //如果poiListResponse不为空，说明是没有走搜索，并且拼接下拉刷新参数
                                    if (me.poiListResponse.length > 0) {
                                        me.poiDetails.forEach(function (value, key) {
                                            me.poiId.push(value.id)
                                        })
                                    }
                                }
                            },
                        });
                    },

                    //其他门店下拉数据获取
                    getStoreList() {
                        var me = this;
                        $.ajax({
                            type: "POST",
                            url: '/saas/basis/api/getOtherStoreList',
                            data: {
                                pid: this.pid,
                                pageSize: 10,
                                pageIndex: this.pageNum,
                                poiId: this.poiId,
                                searchFlag: this.searchFlag,
                                lon: this.lon,
                                lat: this.lat
                            },
                            dataType: 'json',
                            timeout: 10 * 1000,
                            success: function (data) {
                                if (data.errcode == 0) {
                                    me.poiListResponse = me.poiListResponse.concat(data.data && data.data.list ? data.data.list : [])
                                }
                            },
                        });
                    },
                    getData() {
                        this.lat = decodeURIComponent(this.getQueryStringByName("lat"));
                        this.lon = decodeURIComponent(this.getQueryStringByName("lon"));
                        this.pid = decodeURIComponent(this.getQueryStringByName("pid"));
                    },
                    getQueryStringByName(name) {
                        var result = location.search.match(new RegExp("[\?\&]" + name + "=([^\&]+)", "i"));
                        if (result == null || result.length < 1) {
                            return "";
                        }
                        return result[1];
                    },
                    close() {
                        this.isShowChooseMap = false;
                    },
                    getAddress: window.debounce(function () {
                        var me = this;
                        $.ajax({
                            type: "POST",
                            url: '/saas/basis/api/getLocationByAddress',
                            data: {
                                address: this.address,
                                pageNum: 1,
                                pageSize: 10
                            },
                            dataType: 'json',
                            timeout: 10 * 1000,
                            success: function (data) {
                                if (data.errcode == 0) {
                                    //将后台返回的数据回填
                                    me.locationInfoVos = data.data && data.data.locationInfoVos ? data.data.locationInfoVos : [];
                                    if (me.locationInfoVos.length == 0) {
                                        me.show_address_error = true;
                                    } else {
                                        me.show_address_error = false;
                                    }
                                }
                            },
                        });
                    }, 200, false),
                    closeInput() {
                        this.address = "";
                        this.locationInfoVos = [];
                    },
                    bodyScroll(event) {
                        event.preventDefault();
                    },
                    /**
                     * 禁止页面滚动，解决弹框出现时 IOS 上滚动穿透的问题
                     */
                    forbidBodyScroll() {
                        document.getElementsByTagName('body')[0].addEventListener('touchmove', this.bodyScroll, false)
                    },
                    /**
                     * 解除禁止滚动，解决弹框出现时 IOS 上滚动穿透的问题
                     */
                    allowBodyScroll() {
                        document.getElementsByTagName('body')[0].removeEventListener('touchmove', this.bodyScroll, false)
                    }
                },
            })
        }
        init();
        function gQ(name) {
            var result = location.search.match(new RegExp("[\?\&]" + name + "=([^\&]+)", "i"));
            if (result == null || result.length < 1) {
                return "";
            }
            return result[1];
        }
        if (gQ("log") == "1") {
            // init vConsole
            loadVConsle();
        }
        function loadVConsle() {
            function vConsoleCallback() {
                var vConsole = new VConsole();
                console.log('vConsole inited.');
            }
            loadJs("//cdn.weimob.com/saas/im/v2/vconsole.min.js", vConsoleCallback);
        }
        function loadJs(jsUrl, callback) {
            var script = document.createElement("script");
            script.src = jsUrl;
            if (callback) {
                script.addEventListener('load', callback)

            }
            document.body.appendChild(script)
        }
    </script>

</body>

</html>